@use 'sass:math';
@use 'sass:map';

$types: primary, success, warning, danger, error, info;

@mixin set-color-type($colors) {
  @each $type in $types {
    --#{$type}-color: #{map.get($colors, $type, 'base')};
  }
}

@mixin set-color-type-light($colors) {
  @for $i from 1 through 9 {
    @each $type in $types {
      --#{$type}-color-light-#{$i}: #{mix(#fff,
        map.get($colors, $type, 'base'),
        math.percentage(math.div($i, 10)))
      };
    }
  }
}

@mixin set-base-color($colors) {
  --page-bg-color: #{map.get($colors, 'page-color')};
  --content-bg-color: #{map.get($colors, 'content-color')};
  --box-bg-color: #{map.get($colors, 'box-color')};
  --base-text-color-bold: #{map.get($colors, 'text-color', 'primary')};
  --base-text-color: #{map.get($colors, 'text-color', 'regular')};
  --base-text-color-secondary: #{map.get($colors, 'text-color', 'secondary')};
  --base-border-color: #{map.get($colors, 'border-color', 'regular')};
}

@mixin set-shadow() {
  --base-text-shadow: 0 4px 8px rgb(0 0 0 / 16%),
    0 2px 4px rgb(0 0 0 / 12%),
    0 4px 8px rgb(0 0 0 / 8%),
    0 2px 4px rgb(0 0 0 / 4%);
  --base-box-shadow: 0 100px 80px rgb(0 0 0 / 7%),
    0 41.7776px 33.4221px rgb(0 0 0 / 5%),
    0 22.3363px 17.869px rgb(0 0 0 / 4%),
    0 12.5216px 10.0172px rgb(0 0 0 / 4%),
    0 6.6501px 5.32008px rgb(0 0 0 / 3%),
    0 2.76726px 2.21381px rgb(0 0 0 / 2%);
}

@mixin set-dialog-value($dialog-colors) {
  // 对话框
  --dialog-bg-color: #{map.get($dialog-colors, 'bg-color')};
  --dialog-text-color: #{map.get($dialog-colors, 'text-color')};
  --dialog-header-bg-color: #{map.get($dialog-colors, 'header-bg-color')};
  --dialog-header-text-color: #{map.get($dialog-colors, 'header-text-color')};
  --dialog-body-bg-color: #{map.get($dialog-colors, 'body-bg-color')};
  --dialog-body-text-color: #{map.get($dialog-colors, 'body-text-color')};
}